import { useEffect } from 'react';
import { useDispatch, useSelector, ArticleModelState, Link } from 'umi';

import styles from './index.less'
import './index.less'

export default function Articlenav() {
 
   const { getArticleNavList} = useSelector((state: { article: ArticleModelState }) => state.article);
    
       
    const dispatch = useDispatch();
 
    // hooks的生命周期
    useEffect(() => {
        dispatch({
            type: 'article/getArticleNavList',
        })
    }, []);
  

    return (
        <div className={styles.articlenav}>
            <a  href="/">所有</a>
            {
                getArticleNavList.map((item, index:number) => {
                    return <Link key={index} to={`/category/${item.value}`}   >
                        <span>{item.label}</span>
                    </Link>
                })
            }
        </div>)
}

 